<template>
    <div>
        <van-nav-bar title="地址管理" left-text="返回" :right-text="store.flag ? '' : '首页'" left-arrow
            @click-left="proxy.$leftClick()" @click-right="router.push({ name: 'admin' })" />
        <template v-if="store.flag">
            <van-address-list v-model="chosenAddressId" :list="list" default-tag-text="默认" @edit="onEdit2"
                @add="router.push({ name: 'add' })" @select="onSelect" />
        </template>
        <template v-else>
            <van-address-list v-model="chosenAddressId" :list="list" default-tag-text="默认"
                @edit="onEdit" @add="router.push({ name: 'add' })" @select="onSelect" />
        </template>

    </div>
</template>


<script setup lang="ts">
import { getCurrentInstance, ref, onBeforeMount, onUnmounted } from 'vue';
import { useRouter } from 'vue-router';
import { useRess } from '@/store/ress';
import type { AddressListAddress } from 'vant';
import { useDingdan } from '@/store/dingdan';
import { showDialog } from 'vant'
const router = useRouter();
const { proxy }: any = getCurrentInstance()
const store = useRess();
const dingdan = useDingdan()

// 定义类似AddressLIstInfo的属性
type list = {
    id: string,
    name: string,
    tel: string,
    address: string,
    isDefault: boolean,
}
// 定义保存地址列表的容器
const list = ref<list[]>([])
const chosenAddressId = ref('');

// 当点击编辑时
const onEdit = (item: AddressListAddress, index: number) => {
    // 跳转到编辑地址页面 并且传输id
    router.push({ name: 'change', params: { id: item.id } })

}

// 如果是从确认订单页面的进入到的地址列表
const onEdit2 = () => {
    showDialog({
        message: "请在地址管理修改地址"
    })
}

// 当页面渲染前
onBeforeMount(async () => {
    // 清空list容器的数据
    list.value = [];
    // 地址的pinia的方法获取最新的数据信息 地址pinia的ressData就是保存数据的地址
    if(store.flag==false){
        await store.fetchGetRess();
    }
    // 遍历拿到的地址数据
    store.ressData.forEach(item => {
        // 转化为类似AddRessListInfo类型的数据
        list.value.push({
            id: item.addressid,
            name: item.name,
            tel: item.tel,
            address: item.addressDetail,
            isDefault: item.isDefault
        })
    })
    // 如果存在默认地址
    if (list.value.some(item => item.isDefault)) {
        // 设置当前选中为默认地址
        chosenAddressId.value = list.value.find(item => item.isDefault)!.id
    }
    // 如果存在选中地址的id和开关为开
    if (dingdan.dataRess.id && (store.flag == true)) {
        // 证明是从确认订单进来 设置选中
        chosenAddressId.value = dingdan.dataRess.id as string
    }
})


// 当点击切换选中时
const onSelect = (item: AddressListAddress, index: number) => {
    // 如果开关是开的
    if (store.flag) {
        // 改变订单的地址数据
        dingdan.changeRess(item);

        // 隐私改变默认地址 但本地不显示
        store.queren(item.id as string)
        // 跳转到订单页
        router.push({ name: "dingdanConfirm" })
    }
}

// 在地址列表销毁时
onUnmounted(() => {
    if (store.flag) {
        // 关闭开关
        store.changeFlagF()
    }
})
</script>